<template>
	<view class="container">
		<view class="title-box">
			<view class="title-img">
				<image src="../../static/images/zbzl.jpg"></image>
			</view>
			<view class="title-label-box">
				<view class="label-year">
					<view class="label-top">{{curYear}}</view>
					<view class="label-bottom">年份</view>
				</view>
				<view class="label-city">
					<view class="label-top">河南</view>
					<view class="label-bottom">生源地</view>
				</view>
				<view class="label-subject">
					<view class="label-top">理科综合</view>
					<view class="label-bottom">学科</view>
				</view>
			</view>
		</view>
		<view class="form-box">
			<view class="form-item">
				<view class="item-label">总成绩：</view>
				<view class="item-input">
					<input :disabled="isDisableScore" type="number" v-model="formData.score" />
				</view>
			</view>
			<view class="form-item">
				<view class="item-label">填专业：</view>
				<view class="item-input">
					<input v-model="formData.major" />
				</view>
			</view>
			<view class="submit-btn" @tap="doSubmit">匹配大学</view>
		</view>
	</view>
</template>

<script>
	import { myRequest, showToastMsg } from '../../utils'
	
	export default {
		data() {
			return {
				loading: false,
				curYear: '',
				formData: {
					score: '',
					major: '',
					matchType: 0
				},
				isDisableScore: false,
				userInfo: {}
			}
		},
		
		onLoad(options) {
			const d = new Date()
			this.curYear = d.getFullYear()
			this.formData.matchType = options.t
			this.userInfo = uni.getStorageSync('userInfo')
			if (this.userInfo.userIsExamination == 0) { // 高考前
				this.isDisableScore = this.userInfo.userScore > 0
				this.formData.score = this.userInfo.userScore > 0 ? this.userInfo.userScore : ''
			}
			if (this.formData.matchType == 1) { // 招办直联
				this.formData.major = this.userInfo.userMajorOffice
			} else if (this.formData.matchType == 2) { // 我要上大学
				this.formData.major = this.userInfo.userMajor
			}
		},
		
		methods: {
			
			next() {
				uni.navigateTo({
					url: '/pages/matching_university/matching_university'
				})
			},
			
			doSubmit() {
				
				const that = this
				let d = that.formData
				
				if (d.score.length <= 0) {
					return showToastMsg('请输入总成绩')
				}
				if (d.major.length <= 0) {
					return showToastMsg('请输入专业')
				}
				
				if (that.loading) {
					return
				}
				that.loading = true
				
				let success = function(res) {
					
					that.loading = false
					uni.hideLoading()
					
					if (res.data.code != 20000) {
						return showToastMsg(res.data.message)
					}
					
					showToastMsg(res.data.message)
					uni.navigateTo({
						url: '/pages/matching_university/matching_university?t=' + that.matchType
					})
					
				}
				
				let param = {
					url: '/intention-test/matching',
					data: that.formData
				}
				
				uni.showLoading({
					title: '正在加载'
				})
				myRequest(param, success)
				
			}
			
		}
	}
</script>

<style>
	page {
		background-color: #eeeeee;
	}
	
	.container {
		width: 750rpx;
		height: auto;
	}
	
	.title-box {
		height: 320rpx;
	}
	
	.title-img {
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;
	}
	
	.title-img image {
		width: 750rpx;
		height: 320rpx;
	}
	
	.title-label-box {
		color: #ffffff;
		z-index: 3;
		display: flex;
		flex-direction: row;
		align-items: center;
		padding-top: 104rpx;
	}
	
	.label-year {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-left: 100rpx;
	}
	
	.label-city {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-left: 164rpx;
	}
	
	.label-subject {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-left: 152rpx;
	}
	
	.label-top {
		font-weight: bold;
		font-size: 30rpx;
		z-index: 3;
	}
	
	.label-bottom {
		font-size: 24rpx;
		z-index: 3;
		margin-top: 30rpx;
	}
	
	.form-box {
		width: 750rpx;
		height: 460rpx;
		background-color: #ffffff;
		box-shadow: 0rpx 4rpx 9rpx 0rpx rgba(6, 25, 69, 0.05);
		border-radius: 15rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding-top: 20rpx;
	}
	
	.form-item {
		display: flex;
		flex-direction: row;
		align-items: center;
		margin-top: 40rpx;
	}
	
	.item-label {
		font-size: 30rpx;
		color: #333333;
	}
	
	.item-input {
		width: 460rpx;
		height: 72rpx;
		background-color: #f5f5f5;
		border-radius: 20rpx;
		padding-left: 20rpx;
	}
	
	.item-input input {
		height: 72rpx;
	}
	
	.submit-btn {
		width: 654rpx;
		height: 88rpx;
		background-color: #5683ec;
		border-radius: 44rpx;
		color: #ffffff;
		font-size: 36rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		margin-top: 70rpx;
	}
</style>
